<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Insert title here</title>
		<link rel="stylesheet" href="layui/css/layui.css" media="all">
	</head>
	<body>


		<div class="layuimini-container">
			<div class="layuimini-main">

				<fieldset class="table-search-fieldset">
					<legend>搜索信息</legend>
					<div style="margin: 10px 10px 10px 10px">

						<div class="layui-form-item" style="margin-top: 20px;" onsubmit="false">
							<label class="layui-form-label">角色名</label>
							<div class="layui-input-inline" style="width: 120px;">
								<input type="text" name="name" id="name" class="layui-input">
							</div>

							<button class="layui-btn layui-btn-primary" id="search" data-type="reload">
								<i class="layui-icon"></i> 搜 索
							</button>
						</div>
					</div>
				</fieldset>
				<table class="layui-hide" id="test" lay-filter="test"></table>
				<script type="textml" id="toolbarDemo">
					<div class="layui-btn-container">
				<button class="layui-btn layui-btn-sm" lay-event="addUser">添加<tton>
			</div>
		</script>
				<script type="textml" id="barDemo">
					<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
			<a class="layui-btn layui-btn-xs" lay-event="csk">添加模块</a>
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
	</script>

			</div>
		</div>
	</body>
	<script type="text/javascript" src="js/User.js"></script>
	<script src="layui/layui.js" charset="utf-8"></script>
	<script>
		layui.use('table', function() {
			var table = layui.table;
			var $ = layui.jquery;
			table.render({
				elem: '#test',
				page: 'true',
				toolbar: '#toolbarDemo',
				url: globalData.server + 'roles/getRolesAll',
				method: 'POST',
				cols: [
					[{
						field: 'id',
						title: '编号',
						width: 100,
					}, {
						field: 'name',
						title: '角色',
						width: 100,
					}, {
						title: '操作',
						width: 180,
						toolbar: '#barDemo'
					}]
				],
				id: 'testReload'
			});

			//查询
			$('#search').on('click', function() {
				var name = $("#name").val();


				table.reload('testReload', { //testReload,是上面渲染表格的id
					where: { //接口需要的两个请求参数
						'name': name

					}
				});
			});




			table.on('toolbar(test)', function(obj) {
				switch (obj.event) {
					case 'addUser':
						layer.open({
							type: 2,
							area: ['460px', '200px'],
							content: 'rolesInfo_add.html',
							title: '添加',
							end: function() {
								window.location.reload();
							}
						});
						break;
				};
			});
			table.on('tool(test)', function(obj) {
				if (obj.event === 'del') {
					layer.confirm('真的删除行么', function(index) {
						$.post(globalData.server + "roles/deleteRoles", {
							"id": obj.data.id,
							method: '/deleteRoles'
						}, function(data) {
							if (data.count > 0) {
								console.log('删除成功');
								window.location.reload();
							} else {
								alert('不能删除！');
								window.location.reload();
							}
						}, "json");
					});
				} else if (obj.event === 'edit') {
					console.log(obj.data);
					layer.open({
						type: 2,
						area: ['500px', '400px'],
						content: 'Rolesinfo_update.html',
						title: '编辑',
						success: function(layero, index) {
							var body = layer.getChildFrame('body', index);
							body.find("#id").val(obj.data.id);
							body.find("#name").val(obj.data.name);
						},
						end: function() {
							window.location.reload();
						}
					});
				} else if (obj.event === 'csk') {
					var index = layer.open({
						//title : '给'+globalDat()+'设置角色',
						type: 2,
						shade: 0.2,
						maxmin: true,
						shadeClose: true,
						area: ['500px', '80%'],
						//content : 'rolesmodules.html',
						content: 'rolesmenu.html',
						success: function(layero, index) {
							var body = layer.getChildFrame('body', index);
							body.find("#id").val(obj.data.id);
						},
						end: function() {
							window.location.reload();
						}
					});
					$(window).on("resize", function() {
						layer.full(index);
					});
				}
			});
		});
	</script>
</html>
